<template>
	<div class="student-profill">
		<el-avatar :size="200"
			:src="userInfo.headimgurl?userInfo.headimgurl:defAvatarUrl"
			shape="square">
		</el-avatar>
		<el-descriptions direction="horizontal" title="我的中心" :column="2"
			border>
      <template slot="extra">
				<el-button type="primary" size="small">操作</el-button>
			</template>
			<el-descriptions-item label="unid">{{userInfo.unid}}</el-descriptions-item>
			<el-descriptions-item label="账号">{{userInfo.username}}</el-descriptions-item>
			<el-descriptions-item label="vip等级">{{userInfo.vipLevel}}</el-descriptions-item>
			<el-descriptions-item label="	vip到期时间">
        <el-tag type="danger" effect="light">{{userInfo.vipExpires}}</el-tag>
      </el-descriptions-item>
			<el-descriptions-item label="昵称">
        <el-tag type="success" effect="light">{{userInfo.nickname}}</el-tag>
      </el-descriptions-item>
			<el-descriptions-item label="手机号">{{userInfo.phone}}</el-descriptions-item>
			<el-descriptions-item label="角色名称">{{userInfo.roleName}}</el-descriptions-item>
			<el-descriptions-item label="	性别">
        <el-tag effect="light">{{userInfo.sex}}</el-tag>
      </el-descriptions-item>
			<el-descriptions-item label="省份">{{userInfo.province}}</el-descriptions-item>
      <el-descriptions-item label="城市">{{userInfo.city}}</el-descriptions-item>
		</el-descriptions>
	</div>
</template>

<script>
  import { mapState } from "vuex"
  export default {
    meta:{
      title: 'wdzx',
      icon:"iconfont icon-wode1"
    },
		computed: {
			...mapState(["currentRow","userInfo"])
		},
		data() {
			return {
				defAvatarUrl: "https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png"
			}
		}
  }

</script>